﻿@{
    ViewBag.Title = "DashBoard";
    Layout = "~/Views/Shared/_blueWhaleLayout.cshtml";
}
<style>
    .grid_7 {
        width: 66.333%;
    }

    a.dashboard-module, a.dashboard-module:visited {
        width: 142px;
        height: 142px;
        display: block;
        float: left;
        background: url('../Content/themes/bluewhale/img/dashboard-module.gif') top left no-repeat;
        margin: 0 8px 8px 0;
        text-align: center;
        color: #444444;
    }

        a.dashboard-module img {
            margin-top: 20px;
            width: 70px;
            height: 70px;
        }

    .grid_7 {
        float: left;
    }

    .grid_72 {
        width: 30%;
        min-height: 400px;
        float: left;
    }
</style>

@{Html.RenderPartial("GiangVienMenuPartial");}

<div id="main" class="grid_10">
    <!--  start page-heading -->

    <div id="page-heading" class="box round first grid">
        <h2>QUẢN LÝ GIÁO VỤ</h2>
        <!-- end page-heading -->
        <div class="block">
            <div class="grid_7">
                <a href="@Url.Action("DanhSachGiangVien","GiangVien")" class="dashboard-module">
                    <img src="~/Content/themes/bluewhale/img/teacher_icon.png">
                    <div>Giảng Viên</div>
                </a>

                <a href="@Url.Action("Index","QuanLySinhVien")" class="dashboard-module">
                    <img src="~/Content/themes/bluewhale/img/student_icon.png">
                    <div>Sinh Viên</div>
                </a>

                <a href="@Url.Action("Index","LopMonHoc")" class="dashboard-module">
                    <img src="~/Content/themes/bluewhale/img/class_icon.jpg">
                    <div>Lớp học</div>
                </a>

                <a href="@Url.Action("XepLichGiangDay","XepLich")" class="dashboard-module">
                    <img src="~/Content/themes/bluewhale/img/calendar_icon.png">
                    <div>Xếp lịch</div>
                </a>

                <a href="@Url.Action("Index","TienDoDeTai")" class="dashboard-module">
                    <img src="~/Content/themes/bluewhale/img/research.png">
                    <div>Đề tài</div>
                </a>

                <a href="@Url.Action("Index","TaiLieu")" class="dashboard-module">
                    <img src="~/Content/themes/bluewhale/img/document_icon.png">
                    <div>Tài liệu</div>
                </a>

                <a href="@Url.Action("Index","BanTinGiaoVu")" class="dashboard-module">
                    <img src="~/Content/themes/bluewhale/img/news icon.jpg">
                    <div>Bản tin</div>
                </a>
                <a href="@Url.Action("ThongBaoGiaoVu","ThongBao")" class="dashboard-module">
                    <img src="~/Content/themes/bluewhale/img/Message_Icon.png">
                    <div>Thông báo</div>
                </a>
                <a href="@Url.Action("Index","CaiDat")" class="dashboard-module">
                    <img src="~/Content/themes/bluewhale/img/Setting-icon.png">
                    <div>Cài đặt</div>
                </a>
                <div style="clear: both"></div>
            </div>
            <div class="grid_72">
                <div class="top-content">

                </div>
                <div class="clock">
                    <div id="Date"></div>
                    <ul>
                        <li id="hours"></li>
                        <li id="point">:</li>
                        <li id="min"></li>
                        <li id="point">:</li>
                        <li id="sec"></li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="clear">&nbsp;</div>

<script type="text/javascript">
$(document).ready(function() {
// Create two variable with the names of the months and days in an array
var monthNames = [ "1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12" ]; 
var dayNames = ["Chủ Nhật", "Thứ 2", "Thứ 3", "Thứ4 ", "Thứ ", "Thứ 6", "Thứ 7"]

// Create a newDate() object
var newDate = new Date();
// Extract the current date from Date object
newDate.setDate(newDate.getDate());
// Output the day, date, month and year   
$('#Date').html(dayNames[newDate.getDay()] + " ngày " + newDate.getDate() + ' tháng ' + monthNames[newDate.getMonth()] + ' năm ' + newDate.getFullYear());

setInterval( function() {
	// Create a newDate() object and extract the seconds of the current time on the visitor's
	var seconds = new Date().getSeconds();
	// Add a leading zero to seconds value
	$("#sec").html(( seconds < 10 ? "0" : "" ) + seconds);
	},1000);
	
setInterval( function() {
	// Create a newDate() object and extract the minutes of the current time on the visitor's
	var minutes = new Date().getMinutes();
	// Add a leading zero to the minutes value
	$("#min").html(( minutes < 10 ? "0" : "" ) + minutes);
    },1000);
	
setInterval( function() {
	// Create a newDate() object and extract the hours of the current time on the visitor's
	var hours = new Date().getHours();
	// Add a leading zero to the hours value
	$("#hours").html(( hours < 10 ? "0" : "" ) + hours);
    }, 1000);	
});
</script>